<template>
  <div>
    <el-table
      :data="plantable"
      stripe
      style="width: 100%"
    >
      <el-table-column
        type="index"
        width="50"
      >
      </el-table-column>
      <el-table-column
        prop="hash.tcontent"
        label="培训内容"
      >
      </el-table-column>
      <el-table-column
        prop="hash.ttypename"
        label="培训形式"
      >
      </el-table-column>
      <el-table-column
        prop="hash.classifyname"
        label="培训分类"
      >
      </el-table-column>
      <el-table-column
        prop="hash.company"
        label="培训单位"
      >
      </el-table-column>
      <el-table-column

        label="培训时间段"
      >
        <template slot-scope="scope">
          {{scope.row.hash.pre_begintime}}至{{scope.row.hash.pre_endtime}}
        </template>
      </el-table-column>
      <el-table-column
        prop="hash.starttime"
        label="实际开始时间"
      >
      </el-table-column>

      <el-table-column
        label="是否取证"
      >
        <template slot-scope="scope">
          <div v-if="scope.row.hash.has_cert=='0'">
            否
          </div>
          <div v-if="scope.row.hash.has_cert=='1'">
            是
          </div>
        </template>
      </el-table-column>
      <el-table-column label="操作" width="200">
        <template slot-scope="scope">
          <el-button size="mini" type="primary" @click="uploadreport(scope.row)" v-if="scope.row.hash.isrepresent!='0'&&scope.row.hash.is_upload_report=='0'&&!ischeck">上传报告</el-button>
          <el-button size="mini" type="primary" @click="checkreport(scope.row)" v-if="scope.row.hash.isrepresent!='0'&&scope.row.hash.is_upload_report=='1'">查看</el-button>

        </template>
      </el-table-column>
    </el-table>
    <el-pagination
      v-if="!ischeck"
      @current-change="handleCurrentChange"
      :currentPage.sync="pagobj.currentPage3"
      :pageSize="pagobj.pagesize"
      layout="total, prev, pager, next"
      :total="pagobj.total"
      style="margin:20px 0;text-align:center"
    >
    </el-pagination>


    <el-dialog
      title="上传报告"
      :visible.sync="dialogVisible4"
      appendToBody
      width="40%"
    >
      <el-form labelWidth="100px">
        <el-form-item label="是否取证" style="wdith:100%;" class="is-required">
          <el-select v-model="hashcert" placeholder="请选择" style="width:100%">
            <el-option
              v-for="item in hashcertArr"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
          <div class="el-form-item__error" v-if="hashcert==''">
            请选择是否取证
          </div>
        </el-form-item>
        <el-form-item label="上传报告">
          <upload2 :filelimit="100" :filelink.sync="reportArr" :isedit="false" :ispic="false"
            v-if="isreloadupload"
          ></upload2>
        </el-form-item>

      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="dialogVisible4 = false">取 消</el-button>
        <el-button size="mini" type="primary" @click="submitreport">提 交</el-button>
      </span>
    </el-dialog>
    <el-dialog
      title="查看报告"
      :visible.sync="dialogVisible5"
      appendToBody
      width="40%"
    >
      <el-table
        :data="filetable"
        stripe
        style="width: 100%"
      >
        <el-table-column
          type="index"
          width="50"
        >
        </el-table-column>
        <el-table-column
          prop="hash.filename"
          label="附件名称"
        >
        </el-table-column>
        <el-table-column label="附件操作">
          <template slot-scope="scope">
            <a :href="scope.row.hash.fileurl" target="_blank" download="">下载</a>
          </template>
        </el-table-column>
      </el-table>

    </el-dialog>
  </div>
</template>

<script>
import upload2 from '~/components/common/upload2.vue';

export default {
  data() {
    return {
      ts: this.newStore(),
      reportArr: [],
      filetable: [],
      isreloadupload: true,
      dialogVisible4: false,
      dialogVisible5: false,
      hashcert: '',
      hashcertArr: [{
        label: '是',
        value: '1',
      }, {
        label: '否',
        value: '0',
      }],
      uploadreportid: '',
    };
  },
  components: {
    upload2,
  },
  props: {
    plantable: {
      type: Array,
      required: true,
    },
    pagobj: {
      type: Object,
      required: true,
    },
    ischeck: Boolean,
  },
  methods: {
    handleCurrentChange() {
      this.$parent.getplanlist();
    },
    // 查看报告
    checkreport(item) {
      this.filetable = [];
      const req2 = {
        handle: '33224548EFC2E94F97536D55316F44F2C07046ED2C6C984F',
        id: item.hash.id,
      };
      this.spost(this.ts, '/mainservlet', req2).then((ts) => {
        this.filetable = ts.d.data.operation4;
        this.dialogVisible5 = true;
      });
    },
    // 提交报告
    submitreport() {
      if (this.has_cert == '') {
        this.$message({
          type: 'error',
          message: ' 请仔细核对填写信息',
        });
        return;
      }
      const req = {
        handle: '33224548EFC2E94F0E5A626014E7F81B43FCF0CF68CF6BEF64E8E8DD2DDA9E04BFF0B9210751F692',
        id: this.uploadreportid,
        has_cert: this.hashcert,
        personid: localStorage.getItem('pid'),
        filename: this.postname(this.reportArr),
        fileurl: this.posturl(this.reportArr),
      };
      console.log(req);

      this.spost(this.ts, '/mainservlet', req).then(() => {
        this.$message({
          type: 'success',
          message: '上传成功',
        });
        this.$parent.getplanlist();
        this.dialogVisible4 = false;
      });
    },
    // 上传报告
    uploadreport(item) {
      this.reportArr = [];
      this.hashcert = '';
      this.reload();
      this.uploadreportid = item.hash.id;
      this.dialogVisible4 = true;
    },
    reload() {
      this.isreloadupload = false;
      this.$nextTick(() => {
        this.isreloadupload = true;
      });
    },
    // 公共方法图片数组转路径数组
    posturl(arr) {
      const a = [];
      for (let i = 0; i < arr.length; i += 1) {
        a.push(arr[i].url);
      }
      return a;
    },
    // 公共方法图片数组转名称数组
    postname(arr) {
      const b = [];
      for (let i = 0; i < arr.length; i += 1) {
        b.push(arr[i].name);
      }
      return b;
    },
  },
};
</script>

<style>

</style>
